﻿// Download by http://www.jb51.net
var suningImages = function(){
	var box = $('#bigpics');
	var image = $('#pics');
	var btn = image.find('li');
	var len = btn.length ;
	var ul = image.find('ul');
	var ele_width = ul.find('li').outerWidth(true); //是所有的宽度包括边距
	var ele_dis_count   = Math.floor(ul.outerWidth()/ele_width); //一行显示几个，通过计算得出
	
	return{
		init:function(){
			var that = this ;
			var posx ;
			var posy ;
			var i = 0 ;
			ul.css('width',len*ele_width);
			image.prev('div').click(function(e){
				//alert($(this));
				if(i<=0){
					return false;
				}
				i--;
				that.scroll(i);
				e.preventDefault();
			})
			
			image.next('div').click(function(e){
				if(i>= parseInt(len/ele_dis_count ) || len<=ele_dis_count  ){
					return false;
				}
				i++;	
				that.scroll(i);
				e.preventDefault();
			})
			
			
			btn.each(function(i){
				$(this).find('a').click(function(e){
					index = i ;							 
					that.addbk(i);
					that.loadimg(i);
					e.preventDefault();
				})
			})
			
			
			var index = 0 ;
			// box.click(function(e){
			// 	var e = e || window.event ;
			// 	posx = e.clientX ;
			// 	//判断鼠标位置，鼠标位置大于图片1/2处加
			// 	if(posx>document.documentElement.clientWidth/2){
			// 		index++;
			// 		if(index>=len)
			// 		{
			// 			index=0;
			// 			ul.stop().animate({marginLeft: 0 },300);
			// 		}
			// 		that.next(index);
			// 	}else{
			// 		index--;
			// 		if(index<0){
			// 			index=len-1;
			// 			ul.stop().animate({marginLeft: -ele_width*parseInt(index/ele_dis_count )*ele_dis_count  },300);
			// 		};
			// 		that.prev(index);
			// 	}	
			// 	e.preventDefault();
			// }).mousemove(function(e){
			// 	var e = e || window.event ;
			// 	posx = e.clientX ;
			// 	if(posx>document.documentElement.clientWidth/2){
			// 		box.css('cursor','url(http://img.baidu.com/img/image/mousedown.cur),pointer');
			// 		box.attr('title','下一页');
			// 	}else{
			// 		box.css('cursor','url(http://img.baidu.com/img/image/mousedown.cur),pointer');
			// 		box.attr('title','上一页');
			// 	}
			// });
			
			$(document).keyup(function(e){
				var e = e || window.event ;
				if(e.which == 39){
					index++;
					if(index>=len){
						index=0;
						ul.stop().animate({marginLeft: 0 },300);
					}
					that.next(index);
					
				}else if(e.which== 37 ){
					index--;
					if(index<0){
						index=len-1;
						ul.stop().animate({marginLeft: -ele_width*parseInt(index/ele_dis_count )*ele_dis_count  },300);
					};
					that.prev(index);
				}
			});
			
		},
		loadimg:function(i){
			box.append('<div class="loading"></div>');
			var src = btn.eq(i).find('img').attr('src');
			var maxlen = src.length ;
			newsrc = src.slice(0,maxlen-4)+"f.jpg";
			box.find('img').replaceWith('<img src = ' +newsrc+'  />' ).hide();
			box.find('div.loading').remove();
			box.find('img').fadeIn(250);
		},
		addbk:function(i){
			btn.eq(i).find('a').addClass('on').parent().siblings().find('a').removeClass('on');
		},
		scroll:function(i){
			ul.stop().animate({marginLeft: -ele_width*ele_dis_count *i },300);
		},
		next:function(index){
			var that = this ;
			if(((index)%ele_dis_count )==0){
				ul.stop().animate({marginLeft: -ele_width*(index) },300);
			}
			that.addbk(index);
			setTimeout(function(){that.loadimg(index);},400);
		},
		prev:function(index){
			var that = this ;
			if((index+1)%ele_dis_count ==0){
				ul.stop().animate({marginLeft: -ele_width*parseInt(index/ele_dis_count )*ele_dis_count  },300);
			}
			that.addbk(index);
			setTimeout(function(){that.loadimg(index);},400);
		}
	}
}
$(document).ready(function(){
	suningImages().init();	
})
